<%--
  User: cxs
  Date: 2021/9/30 17:04
  @Version 1.0
  @Motto:放下杂念,只为迎接明天更好的自己
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>编辑</title>
    <script src="${pageContext.request.contextPath}/js/jquery-3.4.1.js" type="text/javascript"></script>
    <script src="${pageContext.request.contextPath}/js/dayjs.min.js" type="text/javascript"></script>
    <style type="text/css">
        table tr th {
            text-align: right;
        }
    </style>
</head>
<body>
<h2>空气质量信息维护界面</h2>
<div>
    <form id="form" action="${pageContext.request.contextPath}/airQualityIndex/update" method="post">
        <table>
            <tr>
                <th>检测区域:</th>
                <td>
                    <select name="districtId" class="sel">

                    </select>
                </td>
            </tr>
            <tr>
                <th>检测日期:</th>
                <td>
                    <input id="date" type="date" name="monitorTime">
                </td>
            </tr>
            <tr>
                <th>PM10值:</th>
                <td>
                    <input name="pm10" type="text" value="${data.pm10}">
                </td>
            </tr>
            <tr>
                <th>PM2.5值:</th>
                <td>
                    <input name="pm25" type="text" value="${data.pm25}">
                </td>
            </tr>
            <tr>
                <th>监测站:</th>
                <td>
                    <input name="monitoringStation" type="text" value="${data.monitoringStation}">
                </td>
            </tr>
            <tr>
                <th colspan="2" style="text-align: center">
                    <button type="button" class="update">添加</button>
                    <button type="button" onclick="history.back()">返回</button>
                </th>
            </tr>
        </table>
    </form>
</div>
<script type="text/javascript">
    window.onload = function () {
        $.get('${pageContext.request.contextPath}/district/list', (resp) => {
            if (resp.code === 200) {
                $(".sel").html('---请选择---');
                $.each(resp.data, (index, obj) => {
                    let opt = $("<option value='" + obj.id + "'>" + obj.name + "</option>")
                    $(".sel").append(opt);
                })
            }
        });

        $("#date").attr("value", dayjs(${data.time1}).format('YYYY-MM-DD'))
        $("#date2").html(dayjs(${data.time2}).format('YYYY-MM-DD HH:mm:ss'))
    }

    $(document).ready(function () {
        $(".update").click(function () {
            $.ajax({
                url: '${pageContext.request.contextPath}/airQualityIndex/add',
                type: 'post',
                data: {
                    districtId: $(".sel").val(),
                    reqTime: $("#date").val(),
                    pm10: $("input[name='pm10']").val(),
                    pm25: $("input[name='pm25']").val(),
                    monitoringStation : $("input[name='monitoringStation']").val()
                },
                datatype: "json",
                success: (resp) => {
                    if (resp.code === 200) {
                        alert(resp.msg);
                        window.location.href = "${pageContext.request.contextPath}/index.html"
                    }
                }
            })
        });
    })
</script>
</body>
</html>
